<template>
	<view class="container">
		<view class="head">
			<view class="title">
				<text>{{groupBuy.title}}</text>
			</view>
			<view class="head_item">
				<text>{{groupBuy.publisher}}</text>
				<text>{{groupBuy.time}}</text>
			</view>
		</view>
		<image :src="groupBuy.img" mode=""></image>
		<view class="content">
			<text>{{groupBuy.content}}</text>
		</view>
		<view class="footer">
			<view class="price">
				<text>团购价：￥{{groupBuy.presentPrice}}</text>
				<text>原价：￥{{groupBuy.originalPrice}}</text>
			</view>
			<text>截止日期：{{groupBuy.endTime}}</text>
			<text>咨询电话：{{groupBuy.telephone}}</text>
			<text>注意事项：{{groupBuy.note}}</text>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				groupBuy: []
			}
		},
		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad(options) {
			// console.log("options",options.id)
			const token = uni.getStorageSync('Token')
			wx.request({
				url: 'http://localhost/dev-api/system//buying/' + options.id,
				method: 'GET',
				header: {
					'Authorization': 'Bearer ' + token, // 添加Bearer Token到请求头
				},
				success: (resp) => {
					this.groupBuy = resp.data.data
				}
			})
		},
		methods: {
			
		}
	}
</script>

<style>
	.container {
		width: 100%;
		height: 100%;
		background-color: #FFFFFF;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	.head {
		width: 95%;
	}
	.title {
		width: 100%;
		height: 30px;
		font-size: 16px;
		/* 加粗 */
		font-weight: bold;
		/* 内容居中 */
		display: flex;
		justify-content: center;
		/* 上下居中 */
		display: flex;
		align-items: center;		
	}
	.head_item {
		width: 100%;
		display: flex;
		/* 两端对齐 */
		justify-content: space-between;
		/* 上下居中 */
		align-items: center;
		margin-bottom: 5px;
	}
	image {
		width: 99%;
	}
	.content {
		width: 95%;
		height: 100px;
		/* 内容居中 */
		display: flex;
		justify-content: center;
		/* 上下居中 */
		align-items: center;
	}
	.footer {
		width: 95%;
		height: 100px;
		display: flex;
		/* 内容居中 */
		justify-content: center;
		/* 换行 */
		flex-direction: column;
	}
	/* price下的第一个text */
	.price text:nth-child(1) {
		margin-right: 30px;
	}
		
	/* price下的第二个text */
	.price text:nth-child(2) {
		/* 字体红色 */
		color: red;
		/* 中划线 */
		text-decoration: line-through;
	}
		
		
</style>